<template>
  <div>
    <el-cascader
      :placeholder="placeholder"
      :value="value"
      :show-all-levels="false"
      :props="{ checkStrictly: true }"
      :options="parentList"
      style="width: 100%"
      :clearable="true"
      :disabled="disabled"
      ref="cascaderVue"
      @change="handleChange"
    ></el-cascader>
  </div>
</template>

<script>
export default {
  name: "elMerchatVue",
  props: {
    all: {
      type: Boolean,
      default: false,
    },
    placeholder: {
      type: String,
      default: "所有",
    },
    childrenMerchant: {
      type: Boolean,
      default: false,
    },
    value: {
      type: Array,
      default: () => [],
    },
    // list: {
    //     type: Array,
    //     default: () => []
    // },
    disabled: {
      type: Boolean,
      default: false,
    },
    requestData: {
      type: Boolean,
      default: true,
    },
  },
  data() {
    return {
      parentList: [],
    };
  },
  created() {
    if (this.requestData) {
      this.$http
        .get(
          `${
            this.all
              ? "/api/merchant/memberbase/getTree?isSelectAll=true"
              : "/api/merchant/memberbase/getTree"
          }`
        )
        .then((res) => {
          if (res.code === "0000") {
            this.parentList = this.deepArr(res.data);
            if (this.childrenMerchant) {
              if (res.data[0].children) {
                this.parentList = this.deepArr(res.data[0].children);
              }
            }
          }
        });
    } else {
      this.parentList = this.$store.state.treeList;
    }
    // if (this.list.length === 0) {
    //
    // } else {
    //     this.parentList = this.list
    // }
  },
  methods: {
    handleChange(val) {
      this.$emit("input", val);
    },
    deepArr(arr) {
      return arr.map((item) => ({
        label: item.name.length>14?item.name.slice(0,16).concat('...'):item.name,
        value: item.id,
        children: item.children.length ? this.deepArr(item.children) : null,
      }));
    },
    getChildIds() {
      const arr = this.$refs.cascaderVue.getCheckedNodes()[0].children;
      let list = [];
      function deepEach(arr) {
        arr.forEach((item) => {
          list.push(item.value);
          if (item.children.length) {
            deepEach(item.children);
          }
        });
      }
      deepEach(arr);
      return list;
    },
  },
};
</script>

